<template>
<view class="pages">
	<!--智能识别
	<view class="bei_zi">
	<text style="color:#3394ff;">智能识别地址</text>	
	</view>
	
	<view class="bei_box">
		<textarea class="bei_area" maxlength="600" auto-focus auto-height placeholder="请粘贴或输入您的详细地址" v-model="address_auto"></textarea>
		<button type="primary" class="botton_" @click="shibie">立即识别</button>
	</view>
	-->
	
		<view class="a_box">
			<view class="a_one flex">
				<text class="a_zi">收货人</text>
				<input class="a_int" placeholder="请填写收货人" v-model="ads_data.name" maxlength="20">
			</view>
			<view class="a_one flex">
				<text class="a_zi">电话号码</text>
				<input class="a_int" placeholder="请填写电话号码"  v-model="ads_data.mobile" type="number" maxlength="11">
			</view>
			<view class="a_one flex" @click="show_picker = true">
				<view class="flex" style="flex-direction: row;">
				<text class="a_zi">收货地址</text>
				<text class="a_zi">：{{ads_data.province +'-'+ ads_data.city +'-'+ads_data.area}}</text>	
				</view>
				
				<view class="qu_box">
					<image class="a_gor" src="@/pages/shop/static/image/shop/gor.png"></image>
				</view>
			</view>
			<view class="a_one flex">
				<text class="a_zi">设为默认地址</text>
				<switch :checked="def" color="#f60" @change="def_change"/>
			</view>
		</view>
		<!-- 详细地址 -->
		<view class="bei_zi" style="margin-top: 5px;">
		<text>详细地址</text>	
		</view>
		
		<view class="bei_box">
			<textarea class="bei_area" maxlength="400" auto-height placeholder="街道、门牌号等" v-model="ads_data.address"></textarea>
		</view>

		
		
		<view style="height: 95px;"></view>

		
		
		<!--citypicker-->
		<citypicker 
		:show_picker="show_picker" 
		v-on:onConfirm="seleced"  
		v-on:onCancel="show_picker = false"> 
		</citypicker>
		

		<view class="footer"  v-if="address_ids == 0 || address_ids == ''">
			<view class="footadd btn-orange btn" style="width: 690rpx;"  @click="fnSubmit">
				<text class="footadd_">立即保存</text>
			</view>
		</view>
		
		<view class="footer fr" style="justify-content: space-between;"  v-if="parseInt(address_ids) >0">

			<view class="footadd btn-gray  btn" style="width: 330rpx;"  @click="fnDelete">
				<text class="footadd_">删除</text>
			</view>
			
			<view class="footadd btn-orange  btn" style="width: 330rpx;"  @click="fnSubmit">
				<text class="footadd_">立即保存</text>
			</view>
			
		</view>
		
		
</view>
</template>

<script>
import $util from "@/util/util.js"  
import citypicker from '../components/citypicker/mpvueCityPicker.vue'
export default {
		data() {
			return {
			show_picker:false,
			ads_data:{
				name:'',
				mobile:'',
				address:'',
				province:'',
				city:'',
				area:''
				},
			address_auto:'',
			address_ids:0,
			def:false,
			}
		},
		components: {
		citypicker
		},
		computed:{
		
		},
		onShow() {
			//alert(2)	
		},
		onLoad(e) {
		if(e.ids && parseInt(e.ids) >0){
		this.address_ids = e.ids;
		this.get_data();
		}
		},
		created() {
			
		},
		methods: {
		get_data(){
		let that = this;
		$util.showProgress();
		$util.ajax({
		url:'Shop/get_address_detail',
		ids:that.address_ids
		},(res,err)=>{
		$util.hideProgress();
		if(res.code == 1){
		that.ads_data = res.data
		if(res.data.nomal == 1){
		that.def = true
		}
		}
		console.log(JSON.stringify(res))
		console.log(JSON.stringify(err))
		})
		},
		seleced(e){
		console.log(JSON.stringify(e));
		this.ads_data.province = e.label[0]
		this.ads_data.city = e.label[1]
		this.ads_data.area = e.label[2]
		this.show_picker = false
		},
		fnSubmit(){
		let data = this.ads_data;
		data.ids = this.address_ids;
		data.url = 'Shop/save_address';
		data.nomal = this.def?1:0;
		data.method = 'post';
		let that = this;
		$util.showProgress();
		$util.ajax(data,(res,err)=>{
		$util.hideProgress();
		//console.log(JSON.stringify(res))
		//console.log(JSON.stringify(err))
		$util.toast(res.msg)
		if(res.code == 1){
		$util.sendEvent('select_addess',{});
		setTimeout(()=>{
			uni.navigateBack()
		},1000)
		}
		})
		
		
		},
		fnDelete(){
		$util.confirm('确认删除该地址？',['确认','取消'],(i)=>{
		if(i ==1){
		let that = this;
		$util.showProgress();
		$util.ajax({
		url:'Shop/del_address',
		ids:that.address_ids
		},(res,err)=>{
		$util.hideProgress();
		$util.toast(res.msg)
		if(res.code == 1){
		setTimeout(()=>{
			uni.navigateBack()
		},1000)
		}
		})
		}	
		})
		},
		def_change(e){
		this.def = e.detail.value
		//$util.alert(this.def)
		},
		shibie(){
			let that = this
			$util.ajax({
				url:'Shop/aiaddress',
				address:that.address_auto
			},(r,e)=>{
				$util.toast(r.msg)
				if(r.code == 1){
					console.log(JSON.stringify(r))
					that.ads_data = {
				    name:r.data.person?r.data.person:'',
				    mobile:r.data.phonenum?r.data.phonenum:'',
					address:r.data.detail?r.data.detail:'',
					province:r.data.province?r.data.province:'',
					city:r.data.city?r.data.city:'',
					area:r.data.county?r.data.county:'',
					}
				}
			})
		}
		}
	}
</script>

<style scoped>
	.a_box{
		padding: 0 15px;
		background-color: white;
	}
	.a_one{
		flex-direction: row;
		justify-content: space-between;
	    align-items: center;
	    height: 51px;
		border-top: 1px solid #f8f8f8;
	}
	.a_zi{
		color: #333333;
	}
	.a_int{
	    width: 210px;
	    height: 30px;
	    text-align: right;
		color: #333333;
		border: none;
	}
	.qu_box{
		flex-direction: row;
		align-items: center;
	}
	.a_picker{
		flex-direction: row;
		justify-content: flex-end;
		align-items: center;
	}
	.a_gor{
	    width: 20px;
	    height: 20px;
	    margin-left: 8px;
	}
	/* 备注 */
	.bei_zi{
	   padding: 15px 15px 4px;
	   background: #ffffff;
	}
	.bei_box{
	    min-height: 110px;
	    box-sizing: border-box;
	    padding: 15px;
		background-color: #ffffff;
		margin-bottom: 5px;
	}
	.bei_area{
		width: 100%;
		min-height: 110px;
		border: none;
	}
	/* btn */
	.footer{
		padding: 20px 30rpx;
		background: #ffffff;
		width: 690rpx;
		position: fixed;
		bottom: 0;
		left: 0;
		border-top: 1px #dfdfdf solid;
	}
	.footadd{
		height: 45px;
		border-radius: 10px;
		text-align: center;
		line-height: 45px;
	}
	.footadd_{
		font-size: 14px;
		color: #ffffff;
	}
	.botton_{
	font-size: 14px;
	    background: #7bbaff;
	}
</style>